<template>
  <div>
    <!-- 不加冒号：静态字符串传递  加冒号：传递的是数字而非字符串 -->
    <CommonCard title="累计销售额" :value="reportData.salesToday">
      <!-- 默认插槽 -->
      <template #default>
        <div>
          <span>日同比</span>
          <span class="css-1">{{ reportData.salesGrowLastDay }}%</span>
          <span :class="{increase:reportData.salesGrowLastDay>0,decrease:reportData.salesGrowLastDay<0}"></span>
        </div>
        <div>
          <span>月同比</span>
          <span class="css-1">{{ reportData.saleSGrowLastMonth }}%</span>
          <span :class="{increase:reportData.salesGrowLastMonth>0,decrease:reportData.salesGrowLastMonth<0}"></span>
        </div>
      </template>
      <!-- 具名插槽 -->
      <template #footer>
        <span>昨日销售额</span>
        <span class="css-1">¥ {{ reportData.salesLastDay }}</span>
      </template>
    </CommonCard>
  </div>
</template>

<script setup>
import CommonCard from './CommonCard.vue'
const props=defineProps({
  reportData: {
    type: Object,
    required: true,
  },
})
</script>

<style scoped></style>
